<template>
	<div class="search-bar">
		<div class="search-input" @click="$router.push('/goods-search')">
			<van-icon name="search" />
			<p>搜索商品</p>
		</div>
	</div>
</template>

<script>
export default {
	name: 'SearchBar'
};
</script>

<style lang="scss" scoped>
.search-bar {
	height: 96px;
	background: #f6f6f6;
	padding: 16px 48px;
	background: $color-white;
	@include flexBox(center);
	.search-input {
		width: 654px;
		height: 64px;
		background: #f6f6f6;
		border-radius: 50px;
		padding: 0 26px;
		color: #b2b2b2;
		font-size: 28px;
		@include flexBox(null, center);
		.van-icon {
			font-size: 44px;
			color: #b2b2b2;
			margin-right: 12px;
		}
	}
}
</style>
